<script>
export default {
  name: "ZH",
  data() {
    return {
      // 商户状态
      yy:'',
      // 修改商户状态
      type:'',
      // 禁用
      dis:true,
      dis1:false,
      //商户禁用
      gis:false,
      // 详情
      dialogVisible: false,
      dialogVisible1: false,
      designFileTable: [],
      // 页号
      current: 1,
      // 页大小
      size: 2,
      // 总记录数
      total: 0,
      // 分页列表
      pageList: [2, 5, 10, 20],
      // 查询表单对象
      designFileSearchForm: {
        isBusinesses:'',
        isVendor:''
      },
      //商户表单
      businesses:{
        isBusiness:''
      },
      //供应商表单
      vendor:{
      },
    }
  },
  methods: {
    // 页大小改变事件
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.size = val
      this.designFileChaXun()
      //清空表单
      this.designFileSearchForm = {}
    },
    // 页号改变事件
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.current = val
      this.designFileChaXun()
    },
    // 查询档案
    designFileChaXun() {
      console.log(4444,this.designFileSearchForm)
      this.$axios.post(`/zhuche/selectAll?pageNum=${this.current}&pageSize=${this.size}`,
          this.designFileSearchForm)
          .then(r => {
            console.log('r', r.data)
            // 取出rows属性，请求页的数据集合
            this.designFileTable = r.data.rows
            // 取出total属性，总记录数
            this.total = r.data.total
          })
    },
    //注销
    handleEdit( index, row){
      //获取当前行数据
      console.log(3435,row)
      this.$axios.delete(`/vendor/deleteById6/${row.userId}`)
          .then(r => {
            this.$axios.delete(`/Businesses/deleteById/${row.userId}`)
              .then(r => {
                this.$axios.delete(`/ShoppingCart/deleteById/${row.userId}`)
                    .then(r => {
                      this.$axios.delete(`/zhuche/${row.userId}`)
                          .then(r => {
                            //弹窗是否确认删除
                            this.$confirm('是否确认注销?', '提示', {
                              confirmButtonText: '确定',
                              cancelButtonText: '取消',
                              type: 'warning'
                            }).then(() => {
                            })
                            this.designFileChaXun()
                          })
                    })
              })
})
    },
    //商户查看详情
    handleEdit1( index, row){
      //获取当前行数据
      console.log(999995,row)
      this.$axios.post(`/Order/selectById?userId=${row.userId}`)
          .then(r => {
            console.log('r', r.data)
            this.businesses = r.data
            if(r.data.isBusiness==1){
              this.yy = '停业休整'
              this.type = 0
            }
            if(r.data.isBusiness==0){
              this.yy = '营业'
              this.type = 1
            }
            this.dis = false
            this.dis1 = true
          })
    },
    //返回
    handleReset(){
      this.dis = true
      this.dis1 = false
      this.gis = false
    },
    //停业修正
    handleEdit6(){
      this.businesses.isBusiness = this.type
      console.log(444,this.businesses)
      this.$axios.put(`/Order/updateById`,this.businesses)
          .then(r => {
            //获取当前行数据
            this.$axios.post(`/Order/selectById?userId=${this.businesses.userId}`)
                .then(r => {
                  console.log('r', r.data)
                  this.businesses = r.data
                  if(r.data.isBusiness==1){
                    this.yy = '停业休整'
                    this.type = 0
                  }
                  if(r.data.isBusiness==0){
                    this.yy = '营业'
                    this.type = 1
                  }
                  this.dis = false
                })
          })
    },
    //供应商查看详情
    handleEdit12( index, row) {
      //获取当前行数据
      console.log(999995, row)
      this.$axios.post(`/vendor/selectById?userId=${row.userId}`)
          .then(r => {
            console.log('r', r.data)
            this.vendor = r.data
            this.dis = false
            this.gis = true
          })
    },
  },
  created() {
    this.designFileChaXun()
  }
}
</script>

<template>
  <div id="ZH">
    <el-form v-show="dis" :inline="true" :model="designFileSearchForm" class="demo-form-inline">
      <el-form-item label="商户">
        <el-select v-model="designFileSearchForm.isBusinesses" placeholder="请选择">
          <el-option label="否" value="0">
          </el-option>
          <el-option label="是" value="1"></el-option>
          <el-option label="未选择" value=""></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="供应商">
        <el-select v-model="designFileSearchForm.isVendor" placeholder="请选择">
          <el-option label="否" value="0">
          </el-option>
          <el-option label="是" value="1"></el-option>
          <el-option label="未选择" value=""></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="designFileChaXun">查询</el-button>
      </el-form-item>
    </el-form>
    <!--基础表格-->
    <el-table v-show="dis"
        border
        :data="designFileTable"
        style="width: 100%">
      <el-table-column
          prop="userId"
          label="id"
          width="180">
      </el-table-column>
      <el-table-column
          prop="userAvatar"
          label="头像图标"
          width="180">
        <template
            slot-scope="scope">
          <img :src="scope.row.userAvatar" alt="" style="width: 50px;height: 50px">
        </template>
      </el-table-column>
      <el-table-column
          prop="userName"
          label="用户名"
          width="180">
      </el-table-column>
      <el-table-column
          prop="phone"
          label="手机号"
          width="180">
      </el-table-column>
      <el-table-column
          prop="userSex"
          label="性别"
          width="180">
      </el-table-column>
      <el-table-column
          prop="isBusinesses"
          label="商户"
          width="180"
      >
        <template
            slot-scope="scope">
          {{scope.row.isBusinesses == 0 ? '否' : '是'}}
          &nbsp;&nbsp;&nbsp;&nbsp;
          <el-button style="width: 100px;height: 40px" type="success" v-if="scope.row.isBusinesses != 0" @click="handleEdit1(scope.$index, scope.row)">查看详情</el-button>
        </template>
      </el-table-column>
      <el-table-column
          prop="isVendor"
          label="供应商"
          width="180">
        <template
            slot-scope="scope">
          {{scope.row.isVendor == 0 ? '否' : '是'}}
          &nbsp;&nbsp;&nbsp;&nbsp;
          <el-button style="width: 100px;height: 40px" type="success" v-if="scope.row.isVendor != 0" @click="handleEdit12(scope.$index, scope.row)">查看详情</el-button>
        </template>
      </el-table-column>
      <el-table-column
          prop="op"
          label="操作"
          width="180">
        <!--作用域插槽-->
        <template slot-scope="scope">
          <el-button type="danger" @click="handleEdit(scope.$index, scope.row)">注销</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-->
    <el-pagination v-show="dis"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="current"
        :page-sizes="pageList"
        :page-size="size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
    </el-pagination>
    <!--商户表单-->
    <el-card v-show="dis1">
      <el-descriptions  class="margin-top" title="商户信息" :column="2" border>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-picture-outline"></i>
            营业执照
          </template>
          <img style="width: 130px;height: 130px;" class="img" :src="businesses.license" alt="" />
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-picture-outline"></i>
            门店图片
          </template>
          <img style="width: 130px;height: 130px;" class="img" :src="businesses.storePicture" alt="" />
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-user"></i>
            店铺名称
          </template>
          {{ businesses.storeName }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-s-custom"></i>
            身份证
          </template>
          {{ businesses.identityCard }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-s-custom"></i>
            负责人
          </template>
          {{ businesses.chargePerson }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-mobile-phone"></i>
            手机号
          </template>
          {{ businesses.phone }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-location-outline"></i>
            门店位置
          </template>
          {{ businesses.location }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-date"></i>
            审核时间
          </template>
          <el-date-picker
              v-model="businesses.checkTime"
              type="datetime"
              :disabled="true"
              value-format="yyyy-MM-dd HH:mm:ss"
              style="width: 190px;">
          </el-date-picker>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-magic-stick"></i>
            审核意见
          </template>
              <span>{{businesses.auditOpinion}}</span>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-magic-stick"></i>
            营业状态
          </template>
          <el-tag type="primary">{{businesses.isBusiness == 0 ? '停业' : '营业'}}</el-tag>
        </el-descriptions-item>
        <el-descriptions-item>
          <el-button style="width: 100px;background-color:#B3C0D1;border: gray"  @click="handleReset">返回</el-button>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <el-button type="success" @click="handleEdit6()">{{yy}}</el-button>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        </el-descriptions-item>
      </el-descriptions>
    </el-card>
    <!--供应商表单-->
    <el-card v-show="gis">
      <el-descriptions  class="margin-top" title="供应商信息" :column="2" border>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-picture-outline"></i>
            营业执照
          </template>
          <img style="width: 130px;height: 130px;" class="img" :src="vendor.license" alt="" />
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-picture-outline"></i>
            许可证
          </template>
          <img style="width: 130px;height: 130px;" class="img" :src="vendor.permit" alt="" />
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-user"></i>
            供应商名称
          </template>
          {{ vendor.vendorName }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i ></i>

          </template>
          {{ vendor.identityCard }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-s-custom"></i>
            负责人
          </template>
          {{ vendor.associates }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-mobile-phone"></i>
            手机号
          </template>
          {{ vendor.phone }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-location-outline"></i>
            位置
          </template>
          {{ vendor.address }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-date"></i>
            审核时间
          </template>
          <el-date-picker
              v-model="vendor.checkTime"
              type="datetime"
              :disabled="true"
              value-format="yyyy-MM-dd HH:mm:ss"
              style="width: 190px;">
          </el-date-picker>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-magic-stick"></i>
            审核意见
          </template>
          <el-input
              v-model="vendor.auditOpinion"
              type="textarea"
              :disabled="true"
              :rows="2"
              placeholder="请输入内容">
          </el-input>
        </el-descriptions-item>
        <el-descriptions-item>
          <el-button style="width: 100px;background-color:#B3C0D1;border: gray"  @click="handleReset">返回</el-button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</el-descriptions-item>
      </el-descriptions>
    </el-card>
  </div>
</template>

<style>
#ZH {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>